<template>
  <a-modal
    :title="title"
    :visible="visible"
    :confirm-loading="confirmLoading"
    @ok="handleOk"
    @cancel="handleCancel"
    destroyOnClose>
    <a-form-model
      ref="ruleForm"
      :model="form"
      :rules="rules"
      :label-col="{ span: 7 }"
      :wrapper-col="{ span: 10 }">
      <a-form-model-item label="所在分组" prop="parentsIds">
        <a-cascader
          style="width:240px;"
          :allowClear="true"
          :options="classifyList"
          :changeOnSelect="true"
          v-model="parentIds"
          placeholder="请选择产品分类"
          @change="parentIdsChange" />
      </a-form-model-item>
      
    </a-form-model>
  </a-modal>
</template>

<script>
export default {
  props: {
    ids: {
      type: Array,
      default() {
        return [];
      },
    },
  },
  data() {
    return {
      title: '修改分组',
      visible: false,
      confirmLoading: false,
      form: {
        parentsIds: []
      },
      rules: {},
      parentId: '',
      parentIds: [],
      // 产品分类
      classifyList: [],
    };
  },
  watch: {
    visible(val) {
      if(val) {
        this.getClassifyList()
        this.parentIds = []
      }
    }
  },
  created() {},
  mounted() {
    this.form = this.$form.createForm(this, { name: "change_parent" });
  },
  methods: {
    formatClassifyList (data) {
      let tmpData = []
      for (let i = 0; i < data.length; i++) {
        let item = {
          label: data[i].classificationName,
          value: data[i].id
        }
        if (data[i].children && data[i].children.length > 0 && data[i].classifyLevel < 2) {
          item['children'] = this.formatClassifyList(data[i].children)
        }
        tmpData.push(item)
      }
      return tmpData
    },
    // 产品分类
    async getClassifyList () {
      let res = await this.$get('/gallery/classification/list')
      console.log(res)
      if (res && res.returnCode == 1000 && res.dataInfo) {
        let tmpData = this.formatClassifyList(res.dataInfo || [])
        this.classifyList = tmpData.filter(item => {
          return item.children && item.children.length > 0
        })
      }
    },
    parentIdsChange(val) {
      if(val.length == 1) {
        this.parentId = val[0]
      } else if(val.length == 2) {
        this.parentId = val[val.length-1]
      }
    },
    handleOk(e) {
      this.confirmLoading = true;
      this.form.validateFields((err, values) => {
        if (!err) {
          let parmas = {
            parentId: this.parentId,
            ids: this.ids
          }
          this.$post('/gallery/classification/update/group', parmas).then((res) => {
            if (res && res.returnCode === 1000) {
              this.$message.success("修改成功！");
              this.visible = false
              this.$emit("handleSubmit");
            } else{
              this.$message.success("修改失败！");
            }
          });
          this.confirmLoading = false;
        }
      })
    },
    handleCancel(e) {
      this.visible = false;
    },
  }
};
</script>

<style lang="less"></style>
